import React, { useState, useEffect, useRef } from 'react';
import { connect } from 'umi';
import styles from './index.less';
import { Avatar } from 'antd';
import { UserOutlined } from '@ant-design/icons';

const GlobalHeader = (props: any) => {
  const { dispatch, loading } = props;
  let role = localStorage.getItem('user');
  const userData = role && JSON.parse(role || '');

  return (
    <div className={styles.headerWrap} style={{ background: '#fff' }}>
      <div className={styles.rightHeader}>
        <div className={styles.userWrap}>
          {`所属公司：${
            userData && userData.company && userData.company.companyName
          }`}
          <Avatar icon={<UserOutlined />} />
          {userData && userData.name}
        </div>
      </div>
    </div>
  );
};

export default connect(({ enoadRouter, loading }) => ({
  ...enoadRouter,
  loading,
}))(GlobalHeader);
